<template>
  <span class="base_key" v-if="isNotEmpty" :style="oneline?'width=100%;display:block;padding:0.3rem 0':'width:auto'">{{ title.trim() }}{{title===''?'':':'}} <span class="base_value"><slot>{{value}}</slot></span></span>
</template>

<script>
import {isNotEmpty} from "../js/commonUtils";

export default {
  name: "KeyValueView",
  props:{
    title:{
      type:String | Number,
      default:""
    },
    value:{
      type:String | Number,
      default:""
    },
    oneline:Boolean
  },
  computed:{
    isNotEmpty () {
      return this.$slots.default!=null || isNotEmpty(this.value);
    }
  }
}
</script>


<style lang="less" scoped>
@import  (once,optional)  "../css/base.less";
</style>
